<template>
  <div class="head-con">
    <nav id="nav_" class="mui-bar-nav ">
      <div class="eco_two">
      <ul class="sw_li">
      <li v-for="(item,index) in navList" @click="toLink(item)" v-if="index<=9">
      <p><img :src="item.image_url" class="sli_img"></p>
      <p>{{item.name}}</p>
      </li>
      </ul>
      </div>
    </nav>
    </div>
</template>

<script>
    // import store from '@/store'
    export default {
      name: "nav",
      // store,
      data () {
        return {
          navList:[],
        }
      },
      mounted(){
        this.getClassification()
      },
      created: function () {

      },
      computed:{

      },
        methods:{
          //获取商品分类
          async getClassification() {
            let params = {

            };
            const res = await this.$axios.get(this.$api.navData, params);
            if (res.success) {
              this.navList = res.data;
            } else {
              this.$toast(res.msg);
            }
          },
          //根据商品分类id跳转详情
          toLink(item){
            this.$router.push({ name:'商品列表',query:{id:item.id,name:item.name}});
          },
      }
    }
</script>

<style scoped>

</style>

